<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="referrer" content="no-referrer" />
    <link rel="icon" href="https://www.21cake.com/favicon.ico">
    <title>21Cake蛋糕官网_24小时蛋糕网上订购_5小时新鲜送达！</title>
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/reset (1).css">
    <link rel="stylesheet" href="./header_footer/css/cakeheader.css">
    <!-- 轮播图 -->
    <link rel="stylesheet" href="./css/swiper.min.css" />
    <link rel="stylesheet" href="./css/swiper.css" />
    <script src="./js/ajax.js"></script>
    <!-- 懒加载 -->
    <script src="js/jquery-1.9.1.min.js"></script>
    <!-- <script src="./jquery-lazyload/jquery.lazyload.min.js"></script> -->




<body>
    <div class="zfg-cake-header"></div>
    <script>
        $(function () {
            // 引头部
            $('.zfg-cake-header').load('./header_footer/cakeheader.html')
            // 尾部
            $('.zfg-cake-foot').load('./header_footer/Foot/html/foot.html')
        })
    </script>
    <!-- 轮播图 -->
    <div id="banner" class="swiper-container">
        <div class="swiper-wrapper">
            <!--  <div class="swiper-slide"> <img src="" alt=""></div>
                <div class="swiper-slide"> <img src="" alt=""></div> -->
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination"></div>
    </div>

    <!-- 五张图 -->
    <div class="ly-w ">
        <div class="ly-fivepic">
            <a href="#1" name="ly-menu1" alt="新品" title="新品">
                <img data-src="./images/bc369fca5990e32df765d24e08221112.jpg" alt="">
            </a>
            <a href="#2" name="ly-menu1" alt="新品" title="新品">
                <img data-src="./images/name2.jpg" alt="">
            </a>
            <a href="#3" name="ly-menu1" alt="新品" title="新品">
                <img data-src="./images/name33.jpg" alt="">
            </a>
            <a href="#4" name="ly-menu1" alt="新品" title="新品">
                <img data-src="./images/name4.jpg" alt="">
            </a>
            <a href="#5" name="ly-menu1" alt="新品" title="新品">
                <img data-src="./images/name5.png" alt="">
            </a>

        </div>
    </div>

    <!-- 新品 -->
    <div class="ly-w ly-home-colorful ly-home-module" name="1">
        <h4 class="ly-home-module-title">
            新品
            <span>/</span>
            <span>专区</span>
        </h4>
        <div ly-color-top-banner>
            <a href="" target="_blank" id="1">
                <img data-src="./images/xinpin.jpg" alt="" style="display: inline-block;">
            </a>
        </div>


        <div class="ly-color-product-list">
            <div class="ly-list-box">
                <ul>
                    <!-- <li>
                            <a href="" target="_blank" name="">
                                <img data-src="" alt="" style="display: block;">
                            </a>
                            <a href="" target="_blank" name="">
                                <h6>蔓生</h6>
                            </a>
                            <a href="" target="_blank" name="">
                                <p>树莓奶油与浆果慕斯蛋糕</p>
                            </a>
                            <div class="ly-tag-list">
                                <a href="" target="_blank" name="">
                                    新品11111
                                </a><a href="" target="_blank" name="">
                                    当季推荐
                                </a>
                            </div>
                            <div class="ly-cart-info">
                                <span class="ly-spec">
                                    价格
                                </span>
                                <a href="javascript:;" class="ly-add-cart1">加入购物车

                                </a>
                            </div>
                            <div class="ly-boxx">
                                        <div class="ly-boxx-price">
                                            <span class="ly-active">￥198.00/454g(1.0磅)</span>
                                            <span>￥198.00/454g</span>
                                            <span>￥198.00/4</span>
                                            <span>￥198.0</span>
                                        </div>
            
                                        <div class="ly-boxx-list1">
                                            <input class="ly-on" type="button" value="按钮1">
                                            <input value="按钮2">
                                            <input value="按钮3">
                                        </div>
            
                                        <div class="ly-buttons">
                                            <div class="ly-buttons1">立即购买 </div>
                                            <div class="ly-buttons2"> 加入购物车</div>
                                        </div>
                                    </div>
                        </li> -->







                </ul>
            </div>
        </div>
    </div>

    <!-- 2 -->
    <div class="ly-w ly-home-colorful ly-home-module" name="2">
        <h4 class="ly-home-module-title">
            生日
            <span>/</span>
            <span>专区</span>
        </h4>
        <div ly-color-top-banner>
            <a href="" target="_blank" id="2">
                <img data-src="./images/生日.jpg" alt="" style="display: inline-block;">
            </a>
        </div>
        <div class="ly-color-product-list">
            <div class="ly-list-box">
                <ul>
                </ul>
            </div>
        </div>
    </div>
    <!-- 3 -->
    <div class="ly-w ly-home-colorful ly-home-module" name="3">
        <h4 class="ly-home-module-title">
            儿童
            <span>/</span>
            <span>专区</span>
        </h4>
        <div ly-color-top-banner>
            <a href="" target="_blank" id="3">
                <img data-src="./images/儿童.jpg" alt="" style="display: inline-block;">
            </a>
        </div>
        <div class="ly-color-product-list">
            <div class="ly-list-box">
                <ul>
                </ul>
            </div>
        </div>
    </div>
    <!-- 4 -->
    <div class="ly-w ly-home-colorful ly-home-module" name="4">
        <h4 class="ly-home-module-title">
            聚会
            <span>/</span>
            <span>专区</span>
        </h4>
        <div ly-color-top-banner>
            <a href="" target="_blank" id="4">
                <img data-src="./images/聚会.jpg" alt="" style="display: inline-block;">
            </a>
        </div>
        <div class="ly-color-product-list">
            <div class="ly-list-box">
                <ul>
                </ul>
            </div>
        </div>
    </div>


    <!-- 活动门 -->
    <div class="ly-w ly-home-activity" name="5">
        <h4 class="ly-home-module-title">
            活动门
            <span>/</span>
            <span>是被吸引了吧</span>
        </h4>
        <ul class=" ly-home-activity-content">
            <li>
                <a href="" target="_blank" id="5">
                    <img data-src="./images/活动门.jpg" alt="" style="display:block;">
                </a>
            </li>
        </ul>
    </div>

    <!-- 廿一客 -->
    <div class="ly-w ly-home-activity">
        <h4 class="ly-home-module-title">
            廿一客
            <span>/</span>
            <span>文章</span>
        </h4>
        <ul class="ly-home-magazine-content">
            <li>
                <a href="" target="_blank" name="">
                    <img data-src="./images/一客1.jpg" alt="" style="display: inline-block;">
                    <h4>冬季刊·进博会</h4>
                    <p>

                        <span></span>
                        <br>
                        <span>阅读全文 >></span>
                    </p>
                </a>
            </li>
            <li>
                <a href="" target="_blank" name="">
                    <img data-src="./images/一客2.jpg" alt="" style="display: inline-block;">
                    <h4>冬季刊·进博会</h4>
                    <p>

                        <span></span>
                        <br>
                        <span>阅读全文 >></span>
                    </p>
                </a>
            </li>
        </ul>
    </div>
    <div class="zfg-cake-foot"></div>

    <!-- 轮播图 -->
    <script src="./js/swiper.min.js"></script>


    <script src="./js/index.js"></script>
    <!-- <script src="./js/list.js"></script> -->

    <!-- 点击加入购物车效果 -->
    <!-- <script>
            let oJiaru = document.querySelectorAll('.ly-add-cart1')
            let oXianshi = document.querySelectorAll('.ly-boxx')

            // oJiaru.forEach((ele) => {
            for (let i = 0; i < oJiaru.length; i++) {
                oJiaru[i].addEventListener('click', function() {
                    oXianshi[i].style.display = "block";
                })
            }
        </script> -->
</body>
    <!-- 链接   http://localhost:8899/cake/cake21/index.html -->
</html>